.nav-primary > .nav-item {
    @apply -relative;
}
.nav-primary > .nav-item:hover {
    @apply -z-10;
}
.nav-primary > .nav-item + .nav-item {
    @apply --ml-px;
}
.nav-primary > .nav-item > a {
    @apply -rounded-none -border;
}
.nav-primary > .nav-item:first-child > a,
.nav-primary > .nav-item:has(.nav-heading) + .nav-item > a {
    border-top-left-radius: var(--nav-radius);
    border-bottom-left-radius: var(--nav-radius);
}
.nav-primary > .nav-item:last-child > a {
    border-top-right-radius: var(--nav-radius);
    border-bottom-right-radius: var(--nav-radius);
}
.nav-primary > .nav-item > .active {
    @apply -text-canvas;
    background: var(--nav-active-color);
    border-color: var(--nav-active-color);
}
.nav-primary > .nav-divider {
    @apply -hidden;
}
